<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link href="css/base.css" rel="stylesheet">
<link href="css/index.css" rel="stylesheet">
<link href="css/m.css" rel="stylesheet">
<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<title>个人博客</title>
<style type="text/css">
.addBlog {
	display: block;
	float: left;
	width: 150px;
	height: 30px;
	font-size: 18px;
	font-weight: bold;
	text-align: center;
	line-height: 30px;
	margin-bottom: 10px;
	cursor: pointer;
	font-weight: bold;
}

.myblogs {
	float: right;
	background-color: #FFC0CB;
	width: 80px;
	height: 30px;
	line-height: 30px;
	font-weight: bold;
	padding-left: 18px;
	margin-right: 10px
}

.draft {
	float: right;
	background-color: #339999;
	width: 65px;
	height: 30px;
	line-height: 30px;
	font-weight: bold;
	padding-left: 18px;
}

.del {
	float: right;
	font-size: 12px;
	font-weight: normal;
	cursor: pointer;
}

.del:HOVER {
	float: right;
	font-size: 12px;
	color: red;
	text-decoration: underline;
	font-weight: normal;
	cursor: pointer;
	font-weight: normal;
}
</style>
</head>
<body>
	<header>
	<div class="logo">
		<c:if test="${empty sessionScope.reqUser }">
			<h3>${sessionScope.username }的个人博客</h3>
		</c:if>
		<c:if test="${!empty sessionScope.reqUser }">
			<h3>${sessionScope.reqUser }的个人博客</h3>
		</c:if>
	</div>
	<nav id="nav">
	<ul>
		<li><a id="index" href="index.jsp">网站首页</a></li>
		<c:if test="${empty sessionScope.reqUser }">
			<li><a id="selected"
				href="BlogServlet?task=queryMyBlog&author=${sessionScope.username }">个人博客</a></li>
		</c:if>
		<c:if test="${!empty sessionScope.reqUser }">
			<li><a id="selected"
				href="BlogServlet?task=queryOtherBlog&author=${sessionScope.reqUser }">个人博客</a></li>
		</c:if>
		<c:if test="${empty sessionScope.reqUser }">
			<li><a href="user/about.jsp">个人资料</a></li>
		</c:if>

		<c:if test="${empty sessionScope.reqUser }">
		<li><a href="ShareServlet?task=queryShareList&username=${sessionScope.username }">生活记录</a></li>
		</c:if>
		<c:if test="${!empty sessionScope.reqUser }">
		<li><a href="ShareServlet?task=queryShareList&username=${sessionScope.reqUser }">生活记录</a></li>
		</c:if>
		<li><a href="user/message.jsp">留言板</a></li>
	</ul>
	</nav></header>
	<div class="mnav">
		<ul>
			<li><a id="index" href="index.jsp">网站首页</a></li>
			<c:if test="${empty sessionScope.reqUser }">
				<li><a
					href="BlogServlet?task=queryMyBlog&author=${sessionScope.username }">个人博客</a></li>
			</c:if>
			<c:if test="${!empty sessionScope.reqUser }">
				<li><a
					href="BlogServlet?task=queryOtherBlog&author=${sessionScope.reqUser }">个人博客</a></li>
			</c:if>
			<c:if test="${empty sessionScope.reqUser }">
				<li><a href="user/about.jsp">个人资料</a></li>
			</c:if>
			<li><a href="user/share.jsp">生活记录</a></li>
			<li><a href="user/message.jsp">留言板</a></li>
		</ul>
	</div>
	<article>
	<div class="l_box">
		<div class="about_me">

			<c:if test="${!empty sessionScope.username }">
				<h2>关于我</h2>
				<ul>
					<i><img src="/images/${sessionScope.userImg }"></i>
					<p>
						<b>姓名：${sessionScope.username }<span style="cursor: pointer;"
							onclick="logout()">[退出登录]</span></b><br> <b>性别：*</b><br> <b>联系电话：1*****</b>
					</p>
				</ul>
			</c:if>
			<c:if test="${empty sessionScope.username }">
				<h2>关于我</h2>
				<ul>
					<i><img src="images/timg.jpg"
						style="height: 80px; width: 120px"></i>
					<p>
						<b><a href="login.jsp">请登录</a></b>

					</p>
				</ul>
			</c:if>
		</div>

		<div class="search">
			<form action="BlogServlet?task=queryBlog" method="post"
				name="searchform" id="searchform">
				<input name="title" id="keyboard" class="input_text"
					value="请输入要搜索的文章标题" style="color: rgb(153, 153, 153);"
					onfocus="if(value=='请输入关键字词'){this.style.color='#000';value=''}"
					onblur="if(value==''){this.style.color='#999';value='请输入要搜索的文章标题'}"
					type="text"> <input name="show" value="title" type="hidden">
				<input name="tempid" value="1" type="hidden"> <input
					name="tbname" value="news" type="hidden"> <input
					name="Submit" class="input_submit" value="搜索" type="submit">
			</form>
		</div>
		<div class="fenlei">
		
		</div>
		<div class="tuijian">
			<h2>最新博客</h2>
			<ul>
				<c:forEach items="${newblogList}" var="newblog">

					<li><a class="article"
						href="BlogServlet?task=queryBlogById&id=${newblog.id }"
						title="${newblog.title }" id="${newblog.id }"> <c:if
								test="${fn:length(newblog.title)>10 }">
                         ${fn:substring(newblog.title, 0, 10)}...
                  </c:if> <c:if test="${fn:length(newblog.title)<=10 }">
                         ${newblog.title }
                   </c:if>
					</a><span style="font-size: 12px; font-weight: normal; float: right">阅读数
							<span id="count">${newblog.count }</span>
					</span></li>
				</c:forEach>

			</ul>
		</div>

		<div class="tuijian">
			<h2>热点博客</h2>
			<ul>
				<c:forEach items="${hotblogList}" var="hotblog">
					<li><a class="article"
						href="BlogServlet?task=queryBlogById&id=${hotblog.id }"
						title="${hotblog.title }" id="${hotblog.id }"> <c:if
								test="${fn:length(hotblog.title)>10 }">
                         ${fn:substring(hotblog.title, 0, 10)}...
                  </c:if> <c:if test="${fn:length(hotblog.title)<=10 }">
                         ${hotblog.title }
                   </c:if>
					</a><span style="font-size: 12px; font-weight: normal; float: right">阅读数
							<span id="count">${hotblog.count }</span>
					</span></li>
				</c:forEach>

			</ul>
		</div>
	</div>
	<div class="r_box">
		<c:if test="${empty sessionScope.reqUser }">
			<div style="width: 680px; height: 40px">
				<a class="addBlog" href="user/blog.jsp" >去写一篇博客>>></a> <a
					class="draft" href="BlogServlet?task=queryMyBlog&status=0">草稿箱</a>
				<a class="myblogs" href="BlogServlet?task=queryMyBlog&status=1">博客列表</a>
			</div>
		</c:if>
		<c:forEach items="${myblogList}" var="blog" varStatus="stas">
		<input class="blogstatus" name="status" value="${blog.status}" style="display: none">
			<li>
				<h3>
					<c:if test="${blog.status==0 }">
						<a class="article"
							href="BlogServlet?task=toUpdateBlogById&id=${blog.id }"
							id="${blog.id }">◤${blog.title }</a>
					</c:if>
					<c:if test="${blog.status==1 }">
						<a class="article"
							href="BlogServlet?task=queryBlogById&id=${blog.id }"
							id="${blog.id }">◤${blog.title }</a>
					</c:if>
					<c:if test="${empty sessionScope.reqUser }">

						<span class="del" id="${blog.id }">删除</span>
					</c:if>
					<br> <span style="font-size: 12px; font-weight: normal;">${blog.author }
						${blog.date } | 阅读数 ${blog.count } </span>
				</h3>
				<p>${content[stas.index]}</p>
			</li>
		</c:forEach>
		<div class="pagelist">${pageTool }</div>
	</div>
	</article>

	<footer>
	<p>
		Design by <a href="/" target="_blank">个人博客</a> <a href="/">ICP备号</a>
	</p>
	</footer>
	<script type="text/javascript">
		
	</script>
	<script type="text/javascript">
		function logout() {
			window.location.href = "UserServlet?task=logout"
		}
	</script>

	<script type="text/javascript">
		$(".article").click(function() {
			var count = $("#count").text();
			var id = $(this).attr("id");
			var href = $(this).attr("href");
			$.ajax({
				type : "post",
				url : "BlogServlet",
				data : {
					"task" : "updateCount",
					"id" : id,
					"count" : count,
				},
				success : function(msg) {

				},

			})
		})
	</script>
	<script type="text/javascript">
		$(function() {
			$
					.ajax({
						type : "post",
						url : "TypeServlet",
						data : {
							"task" : "queryTypeList",
						},
						success : function(msg) {
							var list = eval(msg);
							var str = "<h2>文章分类</h2><ul>";
							for (var i = 0; i < list.length; i++) {
								
								str += "<li><a href='BlogServlet?task=queryBlogByType&type="+list[i].type+"'>" + list[i].type
								+ "</a></li>"
							}
							str += "</ul>";
							$(".fenlei").append(str)
						},

					})
		})
	</script>

	<script type="text/javascript">
		$("#index").click(function() {
			window.location.href = "UserServlet?task=out"
		})
		$(document)
				.on(
						"click",
						".del",
						function() {

							if (confirm("确定删除吗?")) {
								var id = $(this).attr("id");
								$
										.ajax({
											type : "post",
											url : "BlogServlet",
											data : {
												"id" : id,
												"task" : "delete",
											},
											success : function(message) {
												if (message == "true") {
													if($(".blogstatus").val==0){
														window.location.href = "BlogServlet?task=queryMyBlog&status=0"
													}else{
														window.location.href = "BlogServlet?task=queryMyBlog"
													}
													
												}
											}
										});
							}
						})
	</script>

</body>
</html>